<template>
  <div ref="container">
    <breadcrumb :breadList="breadList" :name="name">
      <!-- <div class="handle-box" slot="handleContent">
        <div class="handle-btn">
          <a-button class="common-btn" @click="go_toOperation('create','')">添加设备</a-button>
        </div>
        <div class="handle-btn">
          <a-button class="common-btn">导出列表</a-button>
        </div>
      </div> -->
    </breadcrumb>
    <a-card>
      <a-form @submit="handleSubmit" :form="form">
        <a-row clss="form-row" :gutter="16">
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-item label="用户名称">
              <a-input v-model="queryParam.name" rows="1" placeholder="用户名称"/>
            </a-form-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-item label="设备编号">
              <a-input v-decorator="['queryParam.code', {initialValue: '', rules: [{required: false, message: ''}]}]" rows="1" placeholder="设备编号"/>
            </a-form-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-item label="运行状态">
              <a-select v-decorator="['queryParam.status', {initialValue: '1', rules: [{required: false, message: ''}]}]">
                <a-select-option value="1">报警</a-select-option>
                <a-select-option value="2">故障</a-select-option>
                <a-select-option value="3">正常</a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
        </a-row>
        <a-row clss="form-row" :gutter="16">
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-item label="行政区域">
              <a-input v-model="queryParam.eara" rows="1" placeholder="行政区域"/>
            </a-form-item>
          </a-col>
          <a-col :lg="8" :md="12" :sm="24">
            <a-form-item label="证件号码">
              <a-input v-decorator="['queryParam.identityCode', {initialValue: '', rules: [{required: false, message: ''}]}]" rows="1" placeholder="证件号码"/>
            </a-form-item>
          </a-col>
          <a-col :lg="2" :md="12" :sm="24">
            <a-form-item label="" :colon="false">
              <a-button class="common-btn" style="margin-top:42px;" @click="toSearch('2')">查询</a-button>
            </a-form-item>
          </a-col>
          <a-col :lg="4" :md="12" :sm="24">
            <a-form-item label="" :colon="false">
              <a-button class="common-btn" style="margin-top:42px;" @click="$refs.advSearchModel.add('')">高级搜索</a-button>
            </a-form-item>
          </a-col>
        </a-row>
        <adv-search-model ref="advSearchModel" @closeModel="closeModel"></adv-search-model>
      </a-form>
    </a-card>
    <a-card>
      <a-table
        :columns="columns"
        :dataSource="loadData"
        bordered
        :loading="loading"
        :pagination="false"
        :scroll="{ x: 1000 }">
        <template slot="operation" slot-scope="text, record">
          <p style="display:inline" @click="go_toOperation('detail',record)">
            <a href="javascript:;">详情</a>
          </p>
        </template>
      </a-table>
    </a-card>
  </div>
</template>

<script>
import Breadcrumb from '@/components/tools/Breadcrumb'
import AdvSearchModel from './advSearchModel'
export default {
  name: 'SupplierManagementList',
  components: {
    Breadcrumb,
    AdvSearchModel
  },
  data () {
    return {
      name: '',
      breadList: [],
      loading: false,
      form: this.$form.createForm(this),
      // 查询参数
      queryParam: {},
      // 表头
      columns: [
        {
          title: '户主姓名（企事业单位名称）',
          width: '8%',
          dataIndex: 'householderName'
        }, {
          title: '联系电话',
          width: '6%',
          dataIndex: 'phone'
        }, {
          title: '改造路径',
          width: '8%',
          dataIndex: 'transformationPath'
        }, {
          title: '设备名称',
          width: '8%',
          dataIndex: 'equipmentName'
        }, {
          title: '设备编码',
          width: '8%',
          dataIndex: 'equipmentCode'
        }, {
          title: '网管编码',
          width: '8%',
          dataIndex: 'netCode'
        }, {
          title: '状态',
          width: '8%',
          dataIndex: 'equipmentStatus'
        }, {
          title: '供水温度',
          width: '8%',
          dataIndex: 'supplyWaterTemperature'
        }, {
          title: '回水温度',
          width: '8%',
          dataIndex: 'returnWaterTemperature'
        }, {
          title: '最后通讯时间',
          width: '12%',
          dataIndex: 'lastCommunicationTime'
        }, {
          title: '操作',
          dataIndex: 'operation',
          scopedSlots: { customRender: 'operation' }
        }
      ],
      // 加载数据方法 必须为 Promise 对象
      loadData: []
    }
  },
  created () {
    this.loading = true
    this.getBreadCrumb()
    setTimeout(() => {
      this.getData('1', '')
    }, 1000)
  },
  methods: {
    // 面包屑处理
    getBreadCrumb () {
      this.breadList = []
      this.name = this.$route.name
      this.$route.matched.forEach(item => {
        console.log('1111', item)
        this.breadList.push(item)
      })
    },
    getData (code, type) {
      const data = [
        {
          householderName: '王峰',
          phone: '13287277828',
          transformationPath: '煤改电',
          equipmentName: '空气源热泵',
          equipmentCode: 'A87999837',
          netCode: 'NB2983',
          equipmentStatus: '正常',
          supplyWaterTemperature: '45',
          returnWaterTemperature: '35',
          lastCommunicationTime: '2019/11/18 22:08'

        }, {
          householderName: '路建',
          phone: '13988766627',
          transformationPath: '煤改气',
          equipmentName: '壁挂炉',
          equipmentCode: 'B38872888',
          netCode: 'NB8768',
          equipmentStatus: '报警',
          supplyWaterTemperature: '35',
          returnWaterTemperature: '20',
          lastCommunicationTime: '2019/11/18 22:08'
        }, {
          householderName: '王峰',
          phone: '13287277828',
          transformationPath: '煤改电',
          equipmentName: '空气源热泵',
          equipmentCode: 'A87999837',
          netCode: 'NB2983',
          equipmentStatus: '正常',
          supplyWaterTemperature: '45',
          returnWaterTemperature: '35',
          lastCommunicationTime: '2019/11/18 22:08'

        }, {
          householderName: '路建',
          phone: '13988766627',
          transformationPath: '煤改气',
          equipmentName: '壁挂炉',
          equipmentCode: 'B38872888',
          netCode: 'NB8768',
          equipmentStatus: '报警',
          supplyWaterTemperature: '35',
          returnWaterTemperature: '20',
          lastCommunicationTime: '2019/11/18 22:08'
        }, {
          householderName: '王峰',
          phone: '13287277828',
          transformationPath: '煤改电',
          equipmentName: '空气源热泵',
          equipmentCode: 'A87999837',
          netCode: 'NB2983',
          equipmentStatus: '正常',
          supplyWaterTemperature: '45',
          returnWaterTemperature: '35',
          lastCommunicationTime: '2019/11/18 22:08'

        }, {
          householderName: '路建',
          phone: '13988766627',
          transformationPath: '煤改气',
          equipmentName: '壁挂炉',
          equipmentCode: 'B38872888',
          netCode: 'NB8768',
          equipmentStatus: '报警',
          supplyWaterTemperature: '35℃',
          returnWaterTemperature: '20℃',
          lastCommunicationTime: '2019/11/18 22:08'
        }
      ]
      if (code === '1') {
        this.loadData = data
        setTimeout(() => {
          this.loading = false
        }, 1000)
      } else {
        this.loadData = data
        setTimeout(() => {
          this.loading = false
          this.$success({
            title: '查询成功'
          })
        }, 1000)
        // if (type === 'adv') {
        //   this.isShowAdv = false
        //   this.isShowGen = true
        // } else {
        //   this.isShowAdv = true
        //   this.isShowGen = false
        // }
      }
    },
    toSearch (status, type) {
      this.loading = true
      this.getData(status, type)
    },
    handleSubmit () {
      console.log('ttt')
    },
    closeModel () {
      this.getData('2', '')
    },
    toAddEquipment () {
      this.$router.push({
        name: 'addEquipment'
      })
    },
    go_toOperation (type, record) {
      this.$router.push({
        name: 'equipmentOperationDetail',
        query: {
          type: type,
          proDetails: JSON.stringify(record)
        }
      })
    }
  }
}

</script>

<style lang="less" scoped>
// .handle-box {
//   display: flex;
//   margin-bottom: 10px;
//   margin-left: 800px;
// }
// .handle-btn {
//   margin-left:5px;
// }
</style>
